<script setup>
    import { ref,onMounted } from "vue";
    import http from "@/utils/http.js";

    const list=ref([]);
    const getList=async()=>{
        const response=await http.get("/user/getList");
        list.value=response.data;
    };
    onMounted(() => {
        getList();
    });
</script>

<template>
    <div>
        <h2>用户列表</h2>
        <el-row v-if="list.length>0">
            <el-col v-for="user in list" :key="user.id" :span="4">
                <el-card>
                    <p>id:{{ user.id }}</p>
                    <p>姓名:{{ user.name }}</p>
                    <p>性别:{{ user.gender }}</p>
                    <router-link :to="'/user/'+user.id">查看详情</router-link>
                </el-card>
            </el-col>
        </el-row>
    </div>
</template>